<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>

<link rel="stylesheet" type="text/css"
	href="<c:url value="/css/themes/default/easyui.css"/>">
<link rel="stylesheet" type="text/css"
	href="<c:url value="/css/themes/icon.css"/>">
<script type="text/javascript" src="<c:url value="/js/jquery.min.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/js/jquery.easyui.min.js"/>"></script>
<script type="text/javascript" src="<c:url value="/js/easyui-lang-zh_CN.js"/>"></script>
	
<style>
	ul,li{
		padding: 0px;
		margin: 0px;
	    list-style: none;
	}
</style>
 <script type="text/javascript">
 $(function(){
		//添加或激活选项卡
		$(".nav_btn").linkbutton({onClick: function(){
			var title = $(this).attr("title");
			var url = $(this).attr("url");
			
			//判断该面板是否已打开
			if($("#tt").tabs("exists", title)){
				//已存在则激活
				$("#tt").tabs("select", title);
			}else{
				//不存在
				var config = {
						title: title,
						href: url,
						closable: true
					}
				$("#tt").tabs("add", config);
			}
		}});
		
		//关闭当前
		$("#btn_close_current").linkbutton({onClick:function(){
			//获取选中的面板
			var tab = $('#tt').tabs('getSelected');
			//根据选中的面板获取该面板的索引
			var index = $('#tt').tabs('getTabIndex',tab);
			//根据索引关闭
			if(index != 0){
				$('#tt').tabs('close',index);
			}
		}})
		
		//关闭所有
		$("#btn_close_all").linkbutton({onClick:function(){
			//找到所有的面板
			var tabs = $('#tt').tabs('tabs');
			//从后往前遍历
			for(var i = tabs.length - 1; i > 0; i --){
				$('#tt').tabs('close',i);
			}
		}})
		//打开手术药品管理
		$("#ss").linkbutton({onClick:function(){
			$("#operationsdurg").window({
				'title':'手术药品',
				'href':'to_op_drug2'							
			})
			$("#operationsdurg").window("open");
			
		}})
		
		$("#operationUse").linkbutton({onClick:function(){
			$("#operationsapp").window({
				'title':'手术器械',
				'href':'to_op_apparatus2'							
			})
			$("#operationsapp").window("open");
			
		}})
		$("#opdet").linkbutton({onClick:function(){
			$("#mxjOpDetail").window({
				'title':'手术列表',
				'href':'to_opdetail2'							
			})
			$("#mxjOpDetail").window("open");
			
		}})
		
		$("#operationss").linkbutton({onClick:function(){
			$("#operations").window({
				'title':'手术单',
				'href':'to_outop'							
			})
			$("#operations").window("open");
			
		}})
	})
   </script>	
</head>
<body class="easyui-layout">
    <div data-options="region:'west',title:'功能导航',split:true" style="width:180px;">
    	<div id="aa" class="easyui-accordion" data-options="fit:true, border: false">

    	
		    <div title="手术管理" data-options="iconCls:'icon-skiing'" style="overflow:auto;padding:10px;">
				<ul>
					<li class="drag-item"><a id="operationss" title="手术单" url="to_outop" class="easyui-linkbutton nav_btn" data-options="iconCls:'icon-skiing', plain:true">手术单</a> </li>
				    <li class="drag-item"><a id="ss" title="手术用品"  class="easyui-linkbutton nav_btn" data-options="iconCls:'icon-skiing', plain:true">手术药品</a></li>
				    <li class="drag-item"><a id="operationUse" title="手术用品" url="to_op_apparatus" class="easyui-linkbutton nav_btn" data-options="iconCls:'icon-skiing', plain:true">手术用品</a> </li>
				    <li class="drag-item"><a id="opdet" title="手术列表" url="operation_detail" class="easyui-linkbutton nav_btn" data-options="iconCls:'icon-skiing', plain:true">手术列表</a> </li>
				</ul>
		    </div>
		</div>
    </div>
    <div data-options="region:'center'">
    	<div id="tt" class="easyui-tabs" data-options="fit:true, border:false, tools: '#tab-tools'">
		    <div title="首页" style="padding:20px;display:none;">
				<h1 style="text-align: center;">Welcome user</h1>
		    </div>
		</div>
		<div id="tab-tools" style="border:none; border-bottom: 1px solid rgb(149,184,231);">
			<a id="btn_close_current" href="#" class="easyui-linkbutton" plain="true" iconCls="icon-remove"></a>
			<a id="btn_close_all" href="#" class="easyui-linkbutton" plain="true" iconCls="icon-cancel"></a>
		</div>		
    </div>
    
    <div id="operationsdurg" class="easyui-window" title="手术药品" data-options="collapsible:false,modal:true,minimizable:false,maximizable:false,closed:true"
		 style="width:50%;background: rgb(236,243,255); height:450px"></div>
	<div id="operationsapp" class="easyui-window" title="手术器械" data-options="collapsible:false,modal:true,minimizable:false,maximizable:false,closed:true"
		 style="width: 50%; background: rgb(236, 243, 255); height: 450px"></div>
	<div id="mxjOpDetail" class="easyui-window" title="手术明细管理" data-options="collapsible:false,modal:true,maximizable:false,minimizable:false,closed:true"
		style="width: 55%; background: rgb(236, 243, 255); height: 460px"></div>	
	<div id="operations" class="easyui-window" title="手术" data-options="collapsible:false,minimizable:false,maximizable:false,closed:true" 
		style="width:50%; height:450px"></div>																				
</body>
</html>